<!--
 * @Author: 赖钊亮
 * @Description: 修改昵称
 * @Date: 2020-07-01 14:28:46
 * @LastEditTime: 2020-07-03 14:44:37
 * @LastEditors: Please set LastEditors
 * @FilePath: \mobile_item_121e:\新建文件夹\jkshopping\src\pages\my\components\name.vue
--> 
<template>
  <div>
    <!--修改昵称顶部 -->
    <van-nav-bar title="修改昵称" left-text="返回" left-arrow @click-left="goBack" />
    <van-cell-group>
      <van-field label="用户昵称" placeholder="请输入用户名" @input="input" :value="vip" />
    </van-cell-group>
    <van-button type="danger" @click="modify">确认修改</van-button>
  </div>
</template>

<script>
import * as api from "@/api/apiList/user/user.js";
export default {
  data() {
    return {
      vip: ""
    };
  },
  methods: {
    // 返回上一页
    goBack() {
      this.$router.go(-1);
    },
    //获取用户名字
    async API_user_info() {
      return await api.user_info();
    },
    // 修改用户名字
    async API_userEditInfo(name) {
      let data = {
        username: name
      };
      return await api.userEditInfo(this.qs.stringify(data));
    },
    // 点击修改名字
    async modify() {
      await this.API_userEditInfo(this.vip);
      this.$dialog
        .confirm({
          message: "是否修改昵称"
        })
        .then(() => {
          this.$router.push("/system")
        })
        .catch(() => {
          // on cancel
        });
    },
    //获取输入的值
    input(value) {
      this.vip = value;
    }
  }
};
</script>

<style lang="scss" scoped>
.van-button {
  display: block;
  width: 80%;
  margin: 20px auto;
}
</style>